<html><head>
		<title>WebGLORE</title>
		<link href="./css/styles.css" rel="stylesheet" type="text/css">
		</script><script src="./js/jquery-1.8.2.min.js" language="JavaScript" type="text/javascript"></script>
		<script src="./js/utility_createTask.js" language="JavaScript" type="text/javascript"></script>
		<script src="./js/waitingTip.js" language="JavaScript" type="text/javascript"></script>
		
		
		<!--style type="text/css">
			.buttonText {
			  font: 14px Helvetica Neue;
			}

			#createTask_Submit {
			  background: #EEEEEE;
			  color: #888888;
			  border: 2px solid #AAAAAA;
			  height: 20px;
			  width: 85px;
			  padding: 0 0 0 7px;
			  overflow: hidden;
			  display: block;
			  
			  /*Transition*/
			  -webkit-transition: All 0.5s ease;
			  -moz-transition: All 0.5s ease;
			  -o-transition: All 0.5s ease;
			  -ms-transition: All 0.5s ease;
			  transition: All 0.5s ease;
			  
			  /*Rounded Corners*/
			  -webkit-border-radius: .5em;
			  -moz-border-radius: .5em;
			  border-radius: .5em;
			  
			  /*Gradient*/
			  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
			  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
			  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
			  background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
			  background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
			}

			#createTask_Submit:hover {
				color:#FFB300;
				width: 250px;
			}
		</style-->
	</head>

	<body onload="javascript:getEmailList(); return false;">

		<div id="main_container">

			<div id="left_container">

				<!-- Logo Start -->
				<div id="title">

					<div id="logo">
						<h1>GLORE</h1>
					</div>

					<div id="name">
						<h3>Web-based Grid binary LOgistic REgression (WebGLORE)</h3>
					</div>

				</div>
				<!-- Logo End -->

		<!-- Navigation Start-->
				<div id="navigation" class="border rounded-upper">

					<div id="nav_header" class="bottom-border">
						<h3>Navigation</h3></div>

					<a id="nav_login" class="nav bottom-border" href="./login.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2 class="">Login</h2>
							<p>Log into the GLORE system</p>
						</div>
					</a>
					
					<a id="nav_home" class="nav bottom-border" href="./index.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2 >Home</h2>
							<p>View your GLORE profile page</p>
						</div>
					</a>

					<a id="nav_instructions" class="nav bottom-border" href="./instructions.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2 class="">Instructions</h2>
							<p>Learn the fundamentals of using GLORE</p>
						</div>
					</a>

					<a id="nav_registration" class="nav bottom-border" href="./registration.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2>Registration</h2>
							<p>Register an account in GLORE</p>
						</div>
					</a>

					<a id="nav_createTask" class="nav bottom-border" href="./createTask.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2 class="hightlighted">Create Task</h2>
							<p>Create a new GLORE task</p>
						</div>
					</a>
					
					<a id="nav_wait" class="nav bottom-border" href="./WaitForParticipants.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2>WaitForParticipants</h2>
							<p>Wait for other participants</p>
						</div>
					</a>

					<a id="nav_compute" class="nav bottom-border" href="./computation.jsp">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2>Computation</h2>
							<p>Computation process</p>
						</div>
					</a>
					
					<a id="team" class="nav bottom-border" href="./team.html">
						<div class="nav_icon">
						</div>
						<div class="nav_text">
							<h2>Team</h2>
							<p>Team members</p>
						</div>
					</a>
					
				</div>
				<!-- Navigation End-->
			</div>

			<div id="right_container" class="border rounded-upper">

				<div id="header" class="bottom-border">
					<h2>Create Task</h2>
				</div>

				<div id="error_display">

				</div>

				<div id="content">

					<form id = 'createTask'>
							<div class='top'>
								<h3>Task Information:</h3>
							</div>
							<div class = 'container alignleft'> 
								<div class = 'alignleft'><span>Title</span></div>
								<div class = 'alignleft'><input type='text' id='taskName' name='taskName'></div>
								<div id = 'createTask_title' class = 'formComfirmationImg wrong alignleft' ></div>
								<div class='clear'></div>
							</div>
							<div class ='container alignright'> 
								<div class = 'alignleft'><span>Expires in</span></div>
								<div class = 'alignleft'><input type='text' id='expiration' name='expDays'></div>
								<div class = 'alignleft'><span>days</span></div>
								<div id = 'createTask_expiration' class = 'formComfirmationImg wrong alignleft' ></div>
								<div class='clear'></div>
							</div>
							<div class = 'clear'></div>
							<div class = 'container alignleft'> 
								<div class = 'alignleft'><span>Description</span></div>
								<div class = 'alignleft'><textarea id='description' name='description'></textarea></div>
								<!--  <div id = 'createTask_description' class = 'formComfirmationImg wrong alignleft' ></div> -->
								<div class = 'clear'></div>
							</div>

							<div class = 'clear'></div>

		                    <div class="top">
								<h3>Initiator's Email:</h3>
							</div>
							<div>
							 <div class="container alignleft"> 
								<div class='alignleft'><input id='ownerEmail' name='ownerEmail'>
								
								<script type="text/javascript"><!--
							
								function testPause3() {
								  document.getElementById('error_display').innerHTML = '<p>Login is required to create a task.</p>';
								  setTimeout(function() { document.getElementById('error_display').innerHTML = ''; }, 3000);
								}
								
								document.getElementById('ownerEmail').onmouseover  = testPause3;
								--></script>
								</div>
								<div id="createTask_ownerEmail" class="formComfirmationImg wrong alignleft"></div>
								<div class="clear"></div>				
				           	</div>
				           	<div class="clear"></div>	
				           	</div>
							           
							<div class='top'>
								<h3>Participants' email list:</h3>
							</div>

							<div class="body">
								
									
										<div>
											<textarea id="participants" name="emails" style="width:190px"></textarea>
										</div>
									
										
										<div>
											<select id="emailSelect" multiple="true" style="width:190px">
												<option>---Email---</option>
							           			<option value="0">1@sjtu.edu.cn </option>
									           	<option value="1">2@sjtu.edu.cn </option>
											</select>
										</div>
									
									
										<div>
											<button type="button" class="alignleft" id="addParticipant">Add</button> 
										</div>
										<div>
											<button type="button" class="alignleft" id="resetParticipants">Reset</button> 
										</div>
										<div class="clear"></div>
									
								
							</div>
							<!--  
							<div class = 'body'>
								<tr>
									<td>
										<div>
											<textarea id="participants"name="emails"></textarea>
										</div>
									</td>
									<td>	
										<div>
											<select id="emailSelect" multiple="true">
												<option>---Email---</option>
									           
									           	<option value="0">1@sjtu.edu.cn </option>
									           
									           	<option value="1">2@sjtu.edu.cn </option>
									           
									           	<option value="2">a@a.com </option>
									           
									           	<option value="3">jialan.que@gmail.com </option>
									           
									           	<option value="4">jiq4@pitt.edu </option>
									           
									           	<option value="5">jque@ucsd.edu </option>
							           
											</select>
										</div>
									</td>
									<td>
										<div>
											<button type='button' class='alignleft' id='addParticipant'>Add</button> 
										</div>
										<div>
											<button type='button' class='alignleft' id='resetParticipants' >Reset</button> 
										</div>
										<div class='clear'></div>
									</td>
								</tr>
							</div>
						-->
							<div class='top'>
								<h3>Model Parameters:</h3>
							</div>

							<div class = 'body'>
								<div> 
									<div  class='alignleft'><span>Maximum iterations</span></div>
									<div id = 'createTask_iterationMax' class = 'formComfirmationImg check alignright' ></div>
									<div class='alignright'><input type='text' id='iterationMax' name='iterationMax' value ='20'></div>
								</div>
								<div class='clear'></div>
								<div> 
									<div  class='alignleft'><span>Epsilon (i.e., model precision)</span></div>
									<div id = 'createTask_epsilon' class = 'formComfirmationImg check alignright' ></div>
									<div class='alignright'><input type='text' id='epsilon' name='epsilon' value='0.000001'></div>
								</div>
								<div class='clear'></div>
							</div>
							<div class="body">
								<div>
									<applet border="0"  code="glore.ChooseFileApplet.class" archive="WebGlore.jar" width="390" height="62" BORDER=25 mayscript="">
										<!-- The parameter of applet is added by jwc -->
										<param name="showFilePath" value="showFilePath">
									</applet>
									<div id="choosefile" class="formComfirmationImg wrong alignright"></div>
								</div>
								<div>
									<div class="alignright"><input type="hidden" name="showFilePath" id="showFilePath" size="45"></div>
									<div class="alignright"><input type="hidden" name="showProperty" id="showProperty" value="showProperty" size="45"></div>
								</div>
							</div>
							
							<button type='button' href="#" id='createTask_Submit'>Create Task</button>
							<div id='creatTaskWarning'> </div>
							<script type="text/javascript"><!--
							
							function testPause2() {
							  document.getElementById('creatTaskWarning').innerHTML = "<p> <font color=#00CCFF>After clicking, the system takes a few seconds to validate the task.</font></p>";
							  setTimeout(function() { document.getElementById('creatTaskWarning').innerHTML = ''; }, 3000);
							}




							document.getElementById('createTask_Submit').onmouseover  = testPause2;
							--></script>

						</form>

				</div>

			</div>

		</div>

	

</body></html>